import PropTypes from 'prop-types';
import React from 'react';
import { Fade } from '../fade';
import warning from 'warning';

export interface IBackdropProps {
  visible: boolean;
  onBackdropClick?: () => void;
}

export class Backdrop extends React.Component<IBackdropProps, {}> {

  public static propTypes = {
    visible: PropTypes.bool,
    onBackdropClick: PropTypes.func,
  };

  constructor(props: IBackdropProps) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

  public handleClick() {
    if (this.props.onBackdropClick) {
      this.props.onBackdropClick();
    }
  }

  public render() {
    warning(!this.props.children, '1.80版本起Backdrop组件的children属性已经移除，请注意使用');

    return (
      <Fade className="br-backdrop" active={this.props.visible}  onClick={this.handleClick} />
    );
  }
}
